<template>
  <div>
    <el-descriptions title="新增职务" direction="vertical" :column="3" border>
      <el-descriptions-item width="33%" label="职务名称">
        <el-input type="text" v-model="data.name"></el-input>
      </el-descriptions-item>

      <el-descriptions-item width="33%" label="等级">
        <el-input type="text" v-model="data.value"></el-input>
      </el-descriptions-item>

      <el-descriptions-item width="33%" label="描述">
        <el-input type="text" v-model="data.explain"></el-input>
      </el-descriptions-item>

      <el-descriptions-item width="50%" label="操作">
        <el-button
          :disabled="data.name.trim() == '' || data.value.trim() == ''"
          type="primary"
          @click="events.add"
        >
          新增
        </el-button>
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script setup lang="ts">
import { Add_Duty } from "@/api/org";
import { close_loading, notice, start_loading } from "@/utils/notice";
import { inject, reactive } from "vue";
import { ref } from 'vue'
const Gender = ref('')
interface Data {
  name: string;
  value: string;
  type: string;
  explain: string;
  Gender:string;
}

const data = reactive<Data>({
  name: "",
  value: "",
  type: "",
  explain: "",
  Gender: "",
});



const props = defineProps(["data"]);
data.type = props.data;

const emit = defineEmits(["myclose"]);

const events = {
  async add() {
    start_loading();
    const res = await Add_Duty({
      name: data.name,
      dlv:data.value,
      explain: data.explain,
    });
    notice(res);
    close_loading();
    if (res.code === 0) {
      //通知父组件
      emit("myclose");
    }
  },
};

// console.log(props.data.id);

//const aaa = inject("abc");

//console.log(aaa);
</script>

<style scoped></style>